<template>
  <div>

    <div class="body-layout">
      <header class="top-header">
        <!-- 返回按钮 -->
        <!--<a href="#" class="header-left"></a>-->
        <article class="header-middle"><img src="../assets/images/nav-logo.png"/></article>
      </header>
      <div class="vf-user-login marginTop44" v-show="userDetail.user_id">
        <div class="vf-user-login_img">
          <img :src="userDetail.avatar"/>
        </div>
        <p>{{userDetail.nick_name}}</p>
      </div>

      <div class="vf-user-login marginTop44" v-show="!userDetail.user_id">
        <div class="vf-user-login_img" @click="goTologin">
          <img
            src="../assets/images/icon-user.png"/>
        </div>
        <p>还未登录, <span @click="goTologin">登录/注册</span></p>
      </div>

      <ul class="vf-user-list">
        <li @click="goToRouter('MyConcern')">
          <a href="javascript:;" class="border-bottom vf-user-login_success">
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-heart"></use>
            </svg>
            我的关注 {{(!userDetail.user_id) ? "" : "(" + (collectNum || 0) + ")"}}
          </a>
        </li>
        <li @click="goToRouter('MyCollection')">
          <a href="javascript:;" class="border-bottom vf-user-login_success">
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-star"></use>
            </svg>
            我的收藏 {{(!userDetail.user_id) ? "" : "(" + (concernNum || 0) + ")"}}
          </a>
        </li>
        <li>
          <router-link to="/pages/FeedBack" class="border-bottom vf-user-login_success">
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-message"></use>
            </svg>
            意见反馈
          </router-link>
        </li>
      </ul>
    </div>

    <!-- 底部快速入口 -->
    <Footer type="my"></Footer>
  </div>

</template>

<script>
  import Footer from '@/components/Footer'
  import util from '@/lib/util.js'

  export default {
    name: 'UserCenter',
    data() {
      return {
        userDetail: util.vars.userDetail || {},
        collectNum: util.vars.collectNum,//关注大v
        concernNum: util.vars.concernNum //收藏文章
      }
    },
    components: {
      Footer
    },
    created: function () {
      util.vars.in_time = new Date().getTime();
    },
    methods: {
      getUserDetail() {
        util.ajax.get('user/get').then((res) => {
          if (res.code == '1201') {
            /*this.$router.push({name: 'Login'})*/
          } else if (res.code == '1202') {
            /* this.$router.push({name: 'BindingNumber'})*/
          } else {
            this.userDetail = res.data;
            util.vars["userDetail"] = this.userDetail;
            this.getCollectNum();
            this.getConcernNum();
          }
        });
      },

      //用户关注的大v数量
      getCollectNum() {
        util.ajax.get('user/follow/amount').then((res) => {
          this.collectNum = res.data;
          util.vars["collectNum"] = this.collectNum;
        });
      },

      //用户收藏文章数量
      getConcernNum() {
        util.ajax.get('user/like/amount').then((res) => {
          this.concernNum = res.data;
          util.vars["concernNum"] = this.concernNum;
        });
      },

      goToRouter: function (str) {
        util.ajax.get('user/get').then((res) => {
          if (res.code == '1') {
            this.$router.push({name: str})
          } else {
            this.$router.push({name: 'Login'});
          }
//          else if (res.code == '1202') {
//            this.$router.push({name: 'BindingNumber'});
//          }
        });
      },
      goTologin: function () {
        window.sessionStorage.setItem('routerForm', 6);
        this.$router.push({name: 'Login'})
      }
    },
    mounted() {
      this.getUserDetail();
    }
  }
</script>

<style>
</style>
